<div class="meeting-detail">
    <!-- 头部按钮 -->
    <div class="btn-head">
        <a href="/meetings" class="btn btn-default mr-5">
            <i class="fa fa-arrow-left"></i>
            返回列表
        </a>
        
        <!-- 我申请的 或IT管理员 才有此操作-->
        <if condition="$details['user_id'] eq $_SESSION['user']['id'] or in_array($ITManager,explode(',', $_SESSION['user']['post']))">
            <eq name="details.status" value="0">
                <eq name="details.time_status" value="0">
                    <div class="btn-group mr-5">
                        <a href="/meetings/edit?id={$details.id}" class="btn btn-default">
                            <i class="fa fa-pencil-square-o"></i>
                            编辑
                        </a>
                        <button type="button" class="btn btn-default action" data-action="del" data-id="{$details.id}">
                            <i class="fa fa-times"></i>
                            取消
                        </button>
                    </div>
                    <else/>
                    <div class="btn-group mr-5">
                        <button class="btn btn-default" disabled>
                            <i class="fa fa-pencil-square-o"></i>
                            编辑
                        </button>
                        <button type="button" class="btn btn-default action" disabled>
                            <i class="fa fa-times"></i>
                            取消
                        </button>
                    </div>
                </eq>
            </eq>
        </if>

        <!-- 我是纪要员的 且会议结束才能操作 start-->
        <eq name="details.recorder" value="$Think.session.user.id">
            <eq name="details.status" value="0">
                <eq name="details.time_status" value="2">
                    <empty name="details.summary">
                        <button type="button" class="btn btn-default action" data-action="record" data-id="{$details.id}">
                            <i class="fa fa-plus"></i>
                            创建会议纪要
                        </button>
                        <else/>
                        <button type="button" class="btn btn-default action" disabled>
                            <i class="fa fa-plus"></i>
                            创建会议纪要
                        </button>
                    </empty>
                    <else/>
                    <button type="button" class="btn btn-default action" disabled>
                        <i class="fa fa-plus"></i>
                        创建会议纪要
                    </button>
                </eq>
            </eq>
        </eq>
        <!-- 我是纪要员的 才有此操作 end-->

    </div>

    <!-- 会议详情内容 -->
    <div class="meeting-detail-box">
        <div class="detail-content">
            <div class="word">
                <div style="font-size: 25px;margin-bottom: 10px;">
                    <h3 style="display: inline-block">{$details.title}</h3>
                    <eq name="details.status" value="0">
                        <eq name="details.time_status" value="0">
                            <small class="tag tag-warning"> 未开始 </small>
                        </eq>
                        <eq name="details.time_status" value="1">
                            <small class="tag tag-success"> 进行中 </small>
                        </eq>
                        <eq name="details.time_status" value="2">
                            <small class="tag tag-night"> 已结束 </small>
                        </eq>
                        <else/>
                        <small class="tag tag-danger"> 已取消 </small>
                    </eq>
                </div>
                <div class="time mb-10">
                    <span>
                        <span>
                            <i class="fa fa-clock-o"></i>
                            {$details.year}
                        </span>
                        <span class="hour">
                            {$details.start} - {$details.end}
                        </span>
                    </span>
                    <span class="ml-30">
                        <i class="fa fa-map-marker"></i>
                        <volist name="details.rooms" id="room">
                            <span class="mr-10">{$room.name}</span>
                        </volist>
                    </span>
                    <span class="ml-30">
                        <i class="fa fa-user"></i>
                        {$details.user.author_name} 申请于 {$details.created_at}
                    </span>
                </div>
            </div>
        </div>
        <div class="meeting">
            <p>会议议题</p>
            <div class="con">
                <span>{$details.content|nl2br}</span>
            </div>
        </div>
        <div class="meeting">
            <p>参会人员</p>
            <div class="con">
                <ul>
                    <eq name="details.host" value="$details.recorder">
                        <li>
                            <div class="user">
                                <div>
                                    <img src="{$details.host_detail.author_avatar}" alt="用户头像" class="layui-circle" width="60" height="60">
                                </div>
                                <div>
                                    <span>{$details.host_detail.author_name}(主持、记录)</span>
                                </div>
                            </div>
                        </li>
                        <else/>
                        <li>
                            <div class="user">
                                <div>
                                    <img src="{$details.host_detail.author_avatar}" alt="用户头像" class="layui-circle" width="60" height="60">
                                </div>
                                <div>
                                    <span>{$details.host_detail.author_name}(主持)</span>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="user">
                                <div>
                                    <img src="{$details.recorder_detail.author_avatar}" alt="用户头像" class="layui-circle" width="60" height="60">
                                </div>
                                <div>
                                    <span>{$details.recorder_detail.author_name}(记录)</span>
                                </div>
                            </div>
                        </li>
                    </eq>
                    <volist name="details.participants_detail" id="item">
                        <neq name="item.id" value="$details.host">
                            <neq name="item.id" value="$details.recorder">
                                <li>
                                    <div class="user">
                                        <div>
                                            <img src="{$item.face}" alt="用户头像" class="layui-circle" width="60" height="60">
                                        </div>
                                        <div>
                                            <span>{$item.nickname}</span>
                                        </div>
                                    </div>
                                </li>
                            </neq>
                        </neq>
                    </volist>
                </ul>
            </div>
        </div>
        <div class="meeting">
            <p>备注</p>
            <div class="con">
                <notempty name="details.remark">
                    <span>{$details.remark|nl2br}</span>
                    <else/>
                    无
                </notempty>
            </div>
        </div>
        <div class="meeting">
            <p>相关附件</p>
            <div class="con">
                <notempty name="details.meeting_files">
                    <volist name="details.meeting_files" id="file">
                        <div class="mb-5">
                            <i class="file-icon file-icon-ext-{$file.ext}"></i>
                            <a href="/file-download?path={:encrypt(html_entity_decode($file['path']))}"
                               target="_blank">{$file.name}</a>
                        </div>
                    </volist>
                    <else/>
                    无
                </notempty>
            </div>
        </div>

        <!-- 纪要员录入后才会有 start-->
        <div class="meeting">
            <p style="display: inline-block">会议纪要</p>

            <eq name="showSummary" value="false">
                <notempty name="details.summary">
                    <small class="text-muted ml-10">
                        {$details.recorder_detail.author_name} 创建于 {$details.summary_created_at}
                    </small>
                </notempty>
                <div class="con">
                    <notempty name="details.summary">
                        {$details.summary|html_entity_decode}

                        <!--附件-->
                        <volist name="details.summary_files" id="file">
                            <div>
                                <i class="file-icon file-icon-ext-{$file.ext}"></i>
                                <a href="/file-download?path={:encrypt(html_entity_decode($file['path']))}"
                                   target="_blank">{$file.name}</a>
                            </div>
                        </volist>
                        <else/>
                        纪要员暂未录入会议纪要。
                    </notempty>
                </div>
                <else/>
                <div class="con">
                    暂无权限查看会议纪要。
                </div>
            </eq>
        </div>
        <!-- 纪要员录入后才会有 end-->

        <!-- 纪要员录入的编辑框 start-->
        <form action="" class="layui-form record" style="display: none">
            <input type="hidden" name="id" value="{$details.id}">
            <div class="layui-form-item">
                <div class="m-20 mb-10">
                    <!--内容编辑框-->
                    <textarea id="editor" name="summary" lay-verify="required" placeholder="在此录入该会议的纪要..."></textarea>
                    <script>
                        //富文本编辑器
                        var editor = new Simditor({
                            textarea: $('#editor'),
                            toolbar: [
                                'bold',
                                'italic',
                                'underline',
                                'strikethrough',
                                'color',
                                'emoji',
                                '|',
                                'ol',
                                'ul',
                                'blockquote',
                                'code',
                                'link',
                                'image',
                                'hr',
                                /*'indent',
                                'outdent',*/
                                'alignment'
                            ],
                            emoji: {
                                imagePath: '/Public/simditor-emoji/images/emoji',
                                images : [
                                    /*'hbf2019_jinli_org.png',
                                    '2018new_zhongguozan_org.png',*/
                                    '2018new_erha_org.png',
                                    /*'2018new_baobao_org.png',
                                    '2018new_tanshou_org.png',
                                    '2018new_gui_org.png',*/
                                    '2018new_doge02_org.png',
                                    '2018new_miaomiao_org.png',
                                    '2018new_xiongmao_org.png',
                                    '2018new_jiyan_org.png',
                                    '2018new_xiaoku_thumb.png',
                                    '2018new_qinqin_org.png',
                                    '2018new_touxiao_org.png',
                                    '2018new_kuxiao_org.png',
                                    '2018new_xiaoerbuyu_org.png',
                                    '2018new_haha_org.png',
                                    '2018new_han_org.png',
                                    '2018new_aini_org.png',
                                    '2018new_chijing_org.png',
                                    '2018new_dalian_org.png',
                                    '2018new_chigua_org.png',
                                    '2018new_chongjing_org.png',
                                    '2018new_huaixiao_org.png',
                                    '2018new_huaxin_org.png',
                                    '2018new_yinxian_org.png',
                                    '2018new_yun_org.png',
                                    '2018new_zhouma_org.png',
                                    '2018new_wenhao_org.png',
                                    '2018new_wu_org.png',
                                    '2018new_xixi_org.png',
                                    '2018new_leimu_org.png',
                                    '2018new_ku_org.png',
                                    '2018new_kelian_org.png',
                                    '2018new_beishang_org.png',
                                    '2018new_chanzui_org.png',
                                    '2018new_dahaqian_org.png',
                                    '2018new_ningwen_org.png',
                                    '2018new_nu_org.png',
                                    '2018new_qian_org.png',
                                    '2018new_shengbing_org.png',
                                    '2018new_shuai_org.png',
                                    '2018new_shuijiao_thumb.png',
                                    '2018new_wabi_thumb.png',
                                    '2018new_weiqu_org.png',
                                    '2018new_zhuakuang_org.png',
                                    '2018new_zuohengheng_org.png',
                                    '2018new_youhengheng_org.png',
                                    '2018new_heng_org.png',
                                    '2018new_guzhang_org.png',
                                    '2018new_heixian_org.png',
                                    '2018new_tu_org.png',
                                    '2018new_kouzhao_org.png',
                                    '2018new_tianping_org.png',
                                    '2018new_xianhua_org.png',
                                ],
                            },
                            upload: {
                                url: '/Meetings/uploadImage',
                                params: null,
                                fileKey: 'file',
                                connectionCount: 3,
                                leaveConfirm: 'Uploading is in progress, are you sure to leave this page?'
                            }
                        });
                    </script>
                </div>
                <div class="ml-20">
                    <button type="button" class="layui-btn layui-btn-primary" id="file">
                        <i class="layui-icon">&#xe67c;</i>上传附件
                    </button>
                    <div class="mr-pv"></div>
                </div>
                <div class="ml-20 mt-10">
                    <button type="button" class="layui-btn mt-10" lay-submit lay-filter="save">保存</button>
                </div>
            </div>
        </form>
        <!-- 纪要员录入的编辑框 end-->
    </div>
</div>

<script>
    $(function () {
        layui.use(['form','upload'], function () {
            var form = layui.form,
                upload = layui.upload;

            $(document).on('click', 'button.action', function () {
                var dataId = $(this).attr("data-id"),
                    action = $(this).attr("data-action");
                //删除
                if (action === 'del')
                {
                    layer.confirm('你确定要取消该会议吗？', {
                        icon: 3
                    }, function(){
                        var load = layer.load(2, {shade: [0.5, '#fff']});
                        $.post('/meetings/destroyMeeting', {
                            id: dataId
                        }, function(response) {
                            layer.close(load);
                            if (response.code) {
                                layer.alert(response.msg, {icon: 2, title: "错误提示"});
                            } else {
                                location.href = '/meetings/show?id=' + response.data.id;
                            }
                        }, 'json');
                    });
                }
                //创建纪要
                if (action === 'record')
                {
                    var record = $('.layui-form.record');
                    record.show(); //展示出编辑框
                    editor.focus();   //获得焦点
                    $('html , body').animate({scrollTop: record.offset().top}, 1000); //定位到编辑框
                }
            });


            var index = 1;
            //上传附件
            upload.render({
                elem: '#file',
                url: '/meetings/uploadFiles',
                exts: 'zip|rar|png|jpg|jpeg|doc|xls|gif|xlsx|docx|pdf',
                multiple: true, //可多选
                done: function(response) {
                    if (response.code) {
                        layer.alert(response.msg, {icon: 2, title: "错误提示"});
                    } else {
                        var item = this.item;  //获取当前触发上传的元素
                        var data = response.data;
                        $(item).parent('.ml-20').find('.mr-pv').append(
                            '<div class="clearfix files">\n' +
                            '     <div class="pull-left">\n' +
                            '          <i class="file-icon file-icon-ext-'+data.ext+'"></i>\n' +
                            '          '+data.name+'\n' +
                            '          <input type="hidden" name="files['+index+'][path]" value="'+data.path+'">\n' +
                            '          <input type="hidden" name="files['+index+'][ext]" value="'+data.ext+'">\n' +
                            '          <input type="hidden" name="files['+index+'][savename]" value="'+data.savename+'">\n' +
                            '          <input type="hidden" name="files['+index+'][name]" value="'+data.name+'">\n' +
                            '     </div>\n' +
                            '     <div class="pull-right">\n' +
                            '          <span><i class="icon-remove"></i></span>\n' +
                            '     </div>\n' +
                            '</div>'
                        );
                        index++;
                    }
                }
            });
            
            //移除附件
            $(document).on('click', '.mr-pv .files span', function () {
                var _this = $(this);
                layer.confirm('确定要删除该附件吗？', {icon: 3, title: '提示'}, function (index) {
                    _this.parents('.files').remove();
                    layer.close(index);
                });
            });

            //保存纪要
            form.on('submit(save)', function (data) {
                var load = layer.load(2, {shade: [0.5, '#fff']});
                $.post('/meetings/meetingSummaryStore', data.field, function (response) {
                    layer.close(load);
                    if (response.code) {
                        layer.alert(response.msg, {icon: 2, title: "错误提示"});
                    } else {
                        //重新加载页面
                        location.reload();
                    }
                }, 'json')
            })
        })
    })
</script>